<template>
  <div data-component="Format.ProNameCode" v-if="column.format === 'proNameCode'">
    <!--
      * 产品名称/产品代码
      * 用法：columns传参 { format: 'proNameCode', formatParams: 1|2|3|4 } 详情页类型：1 公募 2 天汇宝 3 收益凭证 4 高端理财
      *       参数类型2   { format: 'proNameCode' } 传formatParams为超链接，不传则是纯文本
      *       参数类型3   { format: 'proNameCode', formatParams: 'productType' } 取row.productType判断
      * 字段可能性：
      * proName proCode
      * prodName prodCode
      * pro_name pro_code
      * prod_name prod_code
      * prdtName prdtCode
      * fund_name fund_code
    -->
    <el-link
      v-if="isLink"
      class="table-pro-name-code"
      type="primary"
      :title="proName"
      :underline="false"
      @click="toDetail(proCode, column.formatParams)">
      <div class="text-ellipsis">{{ proName }}</div>
      {{ proCode }}
    </el-link>
    <div v-else class="table-pro-name-code" :title="proName">
      <div class="text-ellipsis">{{ proName }}</div>
      {{ proCode }}
    </div>
  </div>
</template>

<script>
export default {
  props: {
    scope: {
      type: Object,
      default: () => {}
    },
    column: {
      type: Object,
      default: () => {}
    }
  },
  computed: {
    proName () {
      const { row } = this.scope;
      return row.sht_name || row.proName || row.prodName || row.pro_name || row.prod_name || row.prdtName || row.fund_name || row.security_symbol || row.componentSecuritySymbol || row.component_security_symbol || row.etf_security_symbol || '-';
    },
    proCode () {
      const { row } = this.scope;
      return row.proCode || row.prodCode || row.pro_code || row.prod_code || row.prdtCode || row.fund_code || row.security_id || row.componentSecurityId || row.component_security_id || row.etf_security_id || '-';
    },
    isLink () {
      const isNoParam = this.column.formatParams === undefined;
      const isParamBeNumber = !isNaN(this.column.formatParams);
      const isRowHasValue = !!this.scope.row[this.column.formatParams];
      return !isNoParam && (isParamBeNumber || isRowHasValue);
    },
    market_type () {
      const { row } = this.scope;
      return row.market_type;
    }
  },
  methods: {
    toDetail (proCode, type) {
      if (type && isNaN(type)) {
        type = this.scope.row[type];
      }
      const config = {
        1: { path: '/publicfund/fundDetail', field: 'prodCode' }, // 公募详情
        2: { path: '/tianhuibao/productDetail', field: 'PROD_CODE' }, // 天汇宝详情
        3: { path: '/IncomeReceipts/productDetail', field: 'PRO_CODE' }, // 收益凭证详情
        4: { path: '/senior/detail', field: 'PRO_CODE' } // 高端理财详情
      };
      const item = config[type];
      item && this.$router.push({
        path: item.path,
        query: {
          [item.field]: proCode,
          MARKET_TYPE: this.market_type
        }
      });
    }
  }
};
</script>

<style lang="scss">
.table-pro-name-code{
  display: inline-block;
  width: 100%;
  text-align: center;
  .el-link--inner{
    text-align: center;
    width: 100%;
    display: inline-block;
  }
}
</style>
